<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="">
  <meta name="author" content="Mosaddek">
  <meta name="keyword" content="FlatLab, Dashboard, Bootstrap, Admin, Template, Theme, Responsive, Fluid, Retina">
  <link rel="icon" href="../../img/favicon.ico" type="image/x-icon" />
  <link rel="shortcut icon" href="../../img/favicon.ico" type="image/x-icon" />

  <title>员工入职信息</title>

  <!-- Bootstrap core CSS -->
  <link href="../../css/bootstrap.min.css" rel="stylesheet">
  <link href="../../css/bootstrap-reset.css" rel="stylesheet">
  <!--external css-->
  <link href="../../assets/font-awesome/css/font-awesome.css" rel="stylesheet" />
  <link href="../../assets/jquery-easy-pie-chart/jquery.easy-pie-chart.css" rel="stylesheet" type="text/css" media="screen"
  />
  <link rel="stylesheet" href="../../css/owl.carousel.css" type="text/css">

  <link rel="stylesheet" type="text/css" href="../../assets/bootstrap-datepicker/css/datepicker.css" />
  <link rel="stylesheet" type="text/css" href="../../assets/bootstrap-colorpicker/css/colorpicker.css" />
  <link rel="stylesheet" type="text/css" href="../../assets/bootstrap-daterangepicker/daterangepicker.css" />

  <!-- Custom styles for this template -->
  <link href="../../css/style.css" rel="stylesheet">
  <link href="../../css/style-responsive.css" rel="stylesheet" />

  <!-- HTML5 shim and Respond.js IE8 support of HTML5 tooltipss and media queries -->
  <!--[if lt IE 9]>
      <script src="../../js/html5shiv.js"></script>
      <script src="../../js/respond.min.js"></script>
    <![endif]-->

  <!-- 表格组件 -->
  <link rel="stylesheet" type="text/css" href="../../assets/table/dependents/fontAwesome/css/font-awesome.min.css" media="all"
  />
  <link rel="stylesheet" type="text/css" href="../../assets/table/dlshouwen.grid.css" />
  <link rel="stylesheet" type="text/css" href="../../assets/table/dependents/datePicker/skin/WdatePicker.css" />
  <link rel="stylesheet" type="text/css" href="../../assets/table/dependents/datePicker/skin/default/datepicker.css" />

  <!-- pagesilde组件 -->
  <link rel="stylesheet" type="text/css" href="../../assets/pageslide/jquery.pageslide.css" />

  <!-- 流程图绘制组件 -->
  <link rel="stylesheet" type="text/css" href="../../assets/joint/joint.css" />

  <!-- 当前页面CSS -->
  <link href="../../css/index.css" rel="stylesheet" type="text/css" />


</head>

<body>
  <section id="container" class="">
    <!--header start-->
    <header class="header white-bg">
      <div class="sidebar-toggle-box">
        <div data-placement="right" class="icon-reorder tooltips"></div>
      </div>
      <!--logo start-->
      <a href="#" class="logo">
        <span>Certus</span>Net
      </a>
      <!--logo end-->
      <div class="nav notify-row" id="top_menu">
        <!--  notification start -->
        <ul class="nav top-menu">
          <!-- settings start -->
          <li class="dropdown">
            <a data-toggle="dropdown" class="dropdown-toggle" href="#">
              <i class="icon-tasks"></i>
              <span class="badge bg-success">7</span>
            </a>
            <ul class="dropdown-menu extended tasks-bar">
              <div class="notify-arrow notify-arrow-green"></div>
              <a class="icon-more" href="../../system/notice.html">查看更多</a>
              <li>
                <p class="green">项目动态</p>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">XXX项目，投标成功，项目负责人李四。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">XXX项目，立项成功，项目负责人张三。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">XXX项目，回款成功，项目负责人王五。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">XXX项目，签约成功，项目负责人陈七。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">XXX项目，招标成功，项目负责人吴晓晓。</div>
                  </div>
                </a>
              </li>
            </ul>
          </li>
          <!-- settings end -->
          <!-- inbox dropdown start-->
          <li id="header_inbox_bar" class="dropdown">
            <a data-toggle="dropdown" class="dropdown-toggle" href="#">
              <i class="icon-envelope-alt"></i>
              <span class="badge bg-important">8</span>
            </a>
            <ul class="dropdown-menu extended inbox">
              <div class="notify-arrow notify-arrow-red"></div>
              <a class="icon-more" href="../../system/notice.html">查看更多</a>
              <li>
                <p class="red">通知消息</p>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">编号NJ920392立项申请，审批通过，请及时处理。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">编号NJ92222投标申请，审核通过，请及时处理。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">编号NJ926754招标申请，已同意，请及时处理。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">编号NJ920243线索申请，审批未通过，请及时处理。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">编号NJ920255商务预测，已同意，请及时处理。</div>
                  </div>
                </a>
              </li>
            </ul>
          </li>
          <!-- inbox dropdown end -->
          <!-- notification dropdown start-->
          <li id="header_notification_bar" class="dropdown">
            <a data-toggle="dropdown" class="dropdown-toggle" href="#">
              <i class="icon-bell-alt"></i>
              <span class="badge bg-warning">9</span>
            </a>
            <ul class="dropdown-menu extended notification">
              <div class="notify-arrow notify-arrow-yellow"></div>
              <a class="icon-more" href="../../system/notice.html">查看更多</a>
              <li>
                <p class="yellow">系统公告</p>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">公司内部岗位招聘，有意者请联系相关岗位招聘人员。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">因暴雨天气影响，06月02日全体公司人员放假一天。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">IMS v1.0系统上线，希望各位积极踊跃反馈建议。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">系统更新，新增行政中心板块-新增用章申请。</div>
                  </div>
                </a>
              </li>
              <li>
                <a href="#">
                  <div class="task-info">
                    <div class="desc">系统维护，维护时间：2018年06月01日20:00-2018年06月06日17:00</div>
                  </div>
                </a>
              </li>
            </ul>
          </li>
          <!-- notification dropdown end -->
        </ul>
        <!--  notification end -->
      </div>
      <div class="top-nav ">
        <!--search & user info start-->
        <ul class="nav pull-right top-menu">
          <!-- user login dropdown start-->
          <li class="dropdown">
            <a data-toggle="dropdown" class="dropdown-toggle" href="#">
              <span class="username">用户名</span>
              <b class="caret"></b>
            </a>
            <ul class="dropdown-menu extended logout">
              <div class="log-arrow-up"></div>
              <li>
                <a href="../../office/edit/edit-user-1.html">
                  个人中心
                </a>
              </li>
              <li>
                <a href="../../office/edit/edit-user-2.html">
                  账户设置
                </a>
              </li>
              <li>
                <a href="../../login.html">
                  退出登录
                </a>
              </li>
            </ul>
          </li>
          <!-- user login dropdown end -->
        </ul>
        <!--search & user info end-->
      </div>
    </header>
    <!--header end-->
    <!--sidebar start-->
    <aside>
      <div id="sidebar" class="nav-collapse ">
        <!-- sidebar menu start-->
        <ul class="sidebar-menu">
          <li>
            <a class="" href="../../index.html">
              <i class="icon-windows"></i>
              <span>信息中心</span>
            </a>
          </li>
          <li class="sub-menu">
            <a href="javascript:;" class="">
              <i class="icon-book"></i>
              <span>我的项目</span>
              <span class="arrow"></span>
            </a>
            <ul class="sub">
              <li>
                <a class="" href="../../project/project.html">项目管理</a>
              </li>
              <li>
                <a class="" href="../../project/customer.html">客户管理</a>
              </li>
              <li>
                <a class="" href="../../project/demand.html">需求管理</a>
              </li>
              <li>
                <a class="" href="../../project/problem.html">问题管理</a>
              </li>
              <li>
                <a class="" href="../../project/quality.html">质量管理</a>
              </li>
            </ul>
          </li>
          <li class="sub-menu active">
            <a href="javascript:;" class="">
              <i class="icon-exchange"></i>
              <span>我的流程</span>
              <span class="arrow"></span>
            </a>
            <ul class="sub">
              <li>
                <a class="" href="../../do/initiate.html">我的发起</a>
              </li>
              <li class="active">
                <a class="" href="../../do/do.html">待办事项</a>
              </li>
              <li>
                <a class="" href="../../do/tdo.html">已办事项</a>
              </li>
              <li>
                <a class="" href="../../do/meeting.html">会议预定</a>
              </li>
              <li>
                <a class="" href="../../do/oabt.html">出差申请</a>
              </li>
              <li>
                <a class="" href="../../do/afr.html">报销申请</a>
              </li>
              <li>
                <a class="" href="../../do/proc.html">采购申请</a>
              </li>
              <li>
                <a class="" href="../../do/holiday.html">请假调休</a>
              </li>
              <li>
                <a class="" href="../../do/overtime.html">加班申请</a>
              </li>
            </ul>
          </li>
          <li>
            <a href="../../okr/okr.html" class="">
              <i class="icon-calendar"></i>
              <span>OKR管理</span>
            </a>
          </li>
          <li class="sub-menu">
            <a href="javascript:;" class="">
              <i class="icon-folder-close"></i>
              <span>文档管理 </span>
              <span class="arrow"></span>
            </a>
            <ul class="sub">
              <li>
                <a class="" href="../../doct/doct-yf.html">研发类文档</a>
              </li>
              <li>
                <a class="" href="../../doct/doct-sc.html">市场类文档</a>
              </li>
              <li>
                <a class="" href="../../doct/doct-qt.html">行政/其他类</a>
              </li>
            </ul>
          </li>
          <li class="sub-menu">
            <a href="javascript:;" class="">
              <i class="icon-bar-chart"></i>
              <span>运营管理 </span>
              <span class="arrow"></span>
            </a>
            <ul class="sub">
              <li>
                <a class="" href="../../opmt/bi.html">数据图表</a>
              </li>
              <li>
                <a class="" href="../../opmt/focus.html">关注管理</a>
              </li>
              <li>
                <a class="" href="../../opmt/data.html">项目数据</a>
              </li>
              <li>
                <a class="" href="../../opmt/income.html">收入回款</a>
              </li>
              <li>
                <a class="" href="../../opmt/cost.html">项目费用</a>
              </li>
              <li>
                <a class="" href="../../opmt/human.html">人力投入</a>
              </li>
              <li>
                <a class="" href="../../opmt/htgl.html">合同管理</a>
              </li>
            </ul>
          </li>
          <li class="sub-menu">
            <a href="javascript:;" class="">
              <i class="icon-suitcase"></i>
              <span>行政中心</span>
              <span class="arrow"></span>
            </a>
            <ul class="sub">
              <li>
                <a class="" href="../../adms/work.html">工作安排</a>
              </li>
              <li>
                <a class="" href="../../adms/time.html">定时提醒</a>
              </li>
              <li>
                <a class="" href="../../adms/certificate.html">证书使用</a>
              </li>
              <li>
                <a class="" href="../../adms/offseal.html">公章使用</a>
              </li>
              <li>
                <a class="" href="../../adms/assets.html">资产管理</a>
              </li>
              <li>
                <a class="" href="../../adms/proc.html">个人资产</a>
              </li>
              <li>
                <a class="" href="../../adms/docking.html">办公对接</a>
              </li>
            </ul>
          </li>
          <li class="sub-menu">
            <a href="javascript:;" class="">
              <i class="icon-group"></i>
              <span>人事中心</span>
              <span class="arrow"></span>
            </a>
            <ul class="sub">
              <li>
                <a class="" href="../../office/org.html">组织架构</a>
              </li>
              <li>
                <a class="" href="../../office/users.html">员工管理</a>
              </li>
              <li>
                <a class="" href="../../office/attd.html">考勤管理</a>
              </li>
            </ul>
          </li>
          <li class="sub-menu">
            <a href="javascript:;" class="">
              <i class="icon-paste"></i>
              <span>规章制度</span>
              <span class="arrow"></span>
            </a>
            <ul class="sub">
              <li>
                <a class="" href="../../rules/wdgl.html">总则</a>
              </li>
              <li>
                <a class="" href="../../rules/gsbm.html">公司管理制度</a>
              </li>
              <li>
                <a class="" href="../../rules/rygl.html">各部门管理制度</a>
              </li>
            </ul>
          </li>
          <li>
            <a class="" href="../../efficiency/improve.html">
              <i class="icon-rocket"></i>
              <span>效率提升</span>
            </a>
          </li>
          <li>
            <a class="" href="../../school/learning.html">
              <i class="icon-globe"></i>
              <span>网上学堂</span>
            </a>
          </li>
          <li class="sub-menu">
            <a class="" href="javascript:;">
              <i class="icon-cogs"></i>
              <span>系统管理</span>
              <span class="arrow"></span>
            </a>
            <ul class="sub">
              <li>
                <a class="" href="../../system/notice.html">系统公告</a>
              </li>
              <li>
                <a class="" href="../../system/help.html">帮助文档</a>
              </li>
            </ul>
          </li>
          <li class="sub-menu">
            <a class="" href="javascript:;">
              <i class="icon-edit"></i>
              <span>建议反馈</span>
              <span class="arrow"></span>
            </a>
            <ul class="sub">
              <li>
                <a class="" href="../../advice/feedback.html">在线反馈</a>
              </li>
              <li>
                <a class="" href="../../advice/tqus.html">问卷调查</a>
              </li>
            </ul>
          </li>
          <li>
            <a class="" href="javascript:;">
              <i class="icon-comments"></i>
              <span>企业论坛</span>
            </a>
          </li>
        </ul>
        <!-- sidebar menu end-->
      </div>
    </aside>
    <!--sidebar end-->
    <!--main content start-->
    <section id="main-content">
      <section class="wrapper">
        <!--state overview end-->
        <div class="row">
          <div class="col-lg-12">
            <section class="panel">
              <header class="panel-heading">
                员工入职信息
              </header>
              <div class="panel-body">
                <div class="bio-row">
                  <p>
                    <span>入职公司</span>赛特斯信息科技集团</p>
                </div>
                <div class="bio-row">
                  <p>
                    <span>入职部门</span>研发部门</p>
                </div>
                <div class="bio-row">
                  <p>
                    <span>入职岗位</span>平面设计
                  </p>
                </div>
                <div class="bio-row">
                  <p>
                    <span>入职日期</span>2010/01/03 12:00</p>
                </div>
                <div class="bio-row">
                  <p>
                    <span>工作地点</span>南京</p>
                </div>
                <div class="bio-row">
                  <p>
                    <span>工号 </span>001</p>
                </div>
                <div class="bio-row">
                  <p>
                    <span>员工姓名(中文) </span>李四</p>
                </div>
                <div class="bio-row">
                  <p>
                    <span>员工性别</span>男</p>
                </div>
                <div class="bio-row">
                  <p>
                    <span>联系方式1</span>12345678901</p>
                </div>
                <div class="bio-row">
                  <p>
                    <span>联系方式2</span>12345678901</p>
                </div>
                <div class="bio-row line-row">
                  <p>备注说明</p>
                  <p>备注说明测试数据</p>
                </div>
              </div>
            </section>
            <section class="panel">
              <header class="panel-heading tab-bg-dark-navy-blue ">
                <ul class="nav nav-tabs">
                  <li class="active">
                    <a data-toggle="tab" href="#tab1">18栋1楼工位图</a>
                  </li>
                  <li class="">
                    <a data-toggle="tab" href="#tab2">18栋2楼工位图</a>
                  </li>
                  <li class="">
                    <a data-toggle="tab" href="#tab3">18栋3楼工位图</a>
                  </li>
                  <li class="">
                    <a data-toggle="tab" href="#tab4">18栋4楼工位图</a>
                  </li>
                  <li class="">
                    <a data-toggle="tab" href="#tab5">9栋南京LAB工位图</a>
                  </li>
                </ul>
              </header>
              <div class="panel-body">
                <div class="tab-content">
                  <div id="tab1" class="tab-pane active">
                    <div class="col-lg-7 bor-rg">
                      <div id="seat-map" class="seat-map">
                        <div class="front">
                          <span>东 &#8592</span>
                          <span>参考图</span>
                          <span>&#8594 西</span>
                        </div>
                        <img src="../../img/1F.png" style="width:100%;height:auto;margin-bottom: 20px;">
                      </div>
                    </div>
                    <div class="col-lg-5">
                      <div class="booking_area">
                        <div id="legend" class="legend"></div>
                        <label>当前选择：</label>
                        <ul id="selected-seats" class="selected-seats">
                          <li>未选择</li>
                        </ul>
                      </div>
                    </div>

                  </div>
                  <div id="tab2" class="tab-pane">

                    <div class="col-lg-7 bor-rg">
                      <div id="seat-map-2" class="seat-map">
                        <div class="front">
                          <span>东 &#8592</span>
                          <span>参考图</span>
                          <span>&#8594 西</span>
                        </div>
                        <img src="../../img/2F.png" style="width:100%;height:auto;margin-bottom: 20px;">
                      </div>
                    </div>
                    <div class="col-lg-5">
                      <div class="booking_area">
                        <div id="legend-2" class="legend"></div>
                        <label>当前选择：</label>
                        <ul id="selected-seats-2" class="selected-seats">
                          <li>未选择</li>
                        </ul>
                      </div>
                    </div>

                  </div>
                  <div id="tab3" class="tab-pane">

                    <div class="col-lg-7 bor-rg">
                      <div id="seat-map-3" class="seat-map">
                        <div class="front">
                          <span>东 &#8592</span>
                          <span>参考图</span>
                          <span>&#8594 西</span>
                        </div>
                        <img src="../../img/3F.png" style="width:100%;height:auto;margin-bottom: 20px;">
                      </div>
                    </div>
                    <div class="col-lg-5">
                      <div class="booking_area">
                        <div id="legend-3" class="legend"></div>
                        <label>当前选择：</label>
                        <ul id="selected-seats-3" class="selected-seats">
                          <li>未选择</li>
                        </ul>
                      </div>
                    </div>

                  </div>
                  <div id="tab4" class="tab-pane">

                    <div class="col-lg-7 bor-rg">
                      <div id="seat-map-4" class="seat-map">
                        <div class="front">
                          <span>东 &#8592</span>
                          <span>参考图</span>
                          <span>&#8594 西</span>
                        </div>
                        <img src="../../img/4F.png" style="width:100%;height:auto;margin-bottom: 20px;">
                      </div>
                    </div>
                    <div class="col-lg-5">
                      <div class="booking_area">
                        <div id="legend-4" class="legend"></div>
                        <label>当前选择：</label>
                        <ul id="selected-seats-4" class="selected-seats">
                          <li>未选择</li>
                        </ul>
                      </div>
                    </div>

                  </div>
                  <div id="tab5" class="tab-pane">

                    <div class="col-lg-7 bor-rg">
                      <div id="seat-map-5" class="seat-map">
                        <div class="front">
                          <span>东 &#8592</span>
                          <span>参考图</span>
                          <span>&#8594 西</span>
                        </div>
                        <img src="../../img/9F.png" style="width:100%;height:auto;margin-bottom: 20px;">
                      </div>
                    </div>
                    <div class="col-lg-5">
                      <div class="booking_area">
                        <div id="legend-5" class="legend"></div>
                        <label>当前选择：</label>
                        <ul id="selected-seats-5" class="selected-seats">
                          <li>未选择</li>
                        </ul>
                      </div>
                    </div>

                  </div>
                </div>
              </div>
            </section>

            <section class="panel">
              <div class="panel-body">
                <p class="default-buttons">
                  <a href="javascript:void(0);" class="button-back btn btn-info" onclick="window.history.back()">返回</a>
                  <a href="javascript:void(0);" class="button-next  btn btn-success btn-l10" onclick="location.href='./edit-do-121.html'">确认</a>
                </p>
              </div>
            </section>
          </div>
        </div>
      </section>
    </section>
    <!--main content end-->
  </section>
  <!-- js placed at the end of the document so the pages load faster -->
  <script src="../../js/jquery.js"></script>
  <script src="../../js/jquery-1.8.3.min.js"></script>
  <script src="../../js/bootstrap.min.js"></script>
  <script src="../../js/jquery.scrollTo.min.js"></script>
  <script src="../../js/jquery.nicescroll.js" type="text/javascript"></script>
  <script src="../../js/jquery.sparkline.js" type="text/javascript"></script>
  <script src="../../assets/jquery-easy-pie-chart/jquery.easy-pie-chart.js"></script>
  <script src="../../js/owl.carousel.js"></script>
  <script src="../../js/jquery.customSelect.min.js"></script>

  <script type="text/javascript" src="../../assets/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
  <script type="text/javascript" src="../../assets/bootstrap-daterangepicker/date.js"></script>
  <script type="text/javascript" src="../../assets/bootstrap-daterangepicker/daterangepicker.js"></script>

  <!--common script for all pages-->
  <script src="../../js/common-scripts.js"></script>

  <!--script for this page-->
  <script src="../../js/sparkline-chart.js"></script>
  <script src="../../js/easy-pie-chart.js"></script>

  <!-- 外部公共js文件引入 -->
  <script src="../../js/layout.js"></script>
  <!-- layer组件 -->
  <script src="../../assets/layer/layer.js"></script>
  <!-- 选座组件 -->
  <script src="../../assets/seat-charts/jquery.seat-charts.min.js"></script>
  <script>
    var firstSeatLabel = 1;
    $(document).ready(function () {
      var $cart = $('#selected-seats'),
        $total = $('#total'),
        sc = $('#seat-map').seatCharts({
          map: [
            'f_____________',
            '_______ee_e___',
            '_______ee_e_ee',
            'eee__e_ee_e_ee',
            'eee____ee_e_ee',
            '_______ee_e_ee',
            'ee____________',
            'ee____________',
          ],
          seats: {
            f: {
              classes: 'first-class', //your custom CSS class
              category: '办公室'
            },
            e: {
              classes: 'economy-class', //your custom CSS class
              category: '工位'
            }

          },
          naming: {
            top: false,
            getLabel: function (character, row, column) {
              return firstSeatLabel++;
            },
          },
          legend: {
            node: $('#legend'),
            items: [
              ['f', 'available', '办公室'],
              ['e', 'available', '工位'],
              ['f', 'unavailable', '已占用']
            ]
          },
          click: function () {
            var sid = $('.selected').attr('id');
            $('#selected-seats li:first').remove();
            if (sid != undefined) {
              sc.get(sid).status('available');
            }
            if (this.status() == 'available') {
              $('<li>' + this.data().category + this.settings.label + '号座位 </li>')
                .attr('id', 'cart-item-' + this.settings.id)
                .data('seatId', this.settings.id)
                .appendTo($cart);
              return 'selected';
            } else if (this.status() == 'selected') {
              $('#cart-item-' + this.settings.id).remove();
              return 'available';
            } else if (this.status() == 'unavailable') {
              return 'unavailable';
            } else {
              return this.style();
            }
          }
        });
      sc.get([
        '1_1',
        '2_8', '2_9', '2_11',
        '3_8', '3_9', '3_11', '3_13', '3_14',
        '4_1', '4_2', '4_3', '4_6', '4_8', '4_9', '4_11', '4_14',
        '5_1', '5_2', '5_3', '5_8', '5_9', '5_11', '5_13', '5_14',
        '6_8', '6_9', '6_11', '6_13',
        '7_1', '7_2',
        '8_1', '8_2'
      ]).status('unavailable');
    });
  </script>
  <script>
    var firstSeatLabel2 = 1;
    $(document).ready(function () {
      var $cart = $('#selected-seats-2'),
        $total = $('#total-2'),
        sc = $('#seat-map-2').seatCharts({
          map: [
            'f__e__ee__ee__ee_ee',
            '___e__ee__ee__ee_ee',
            '___e__ee__ee__ee_ee',
            '___e__ee__ee__ee_ee',
            'f__________________',
            '___ee_ee__ee__ee_ee',
            'f__ee_ee__ee__ee_ee',
            '___ee_ee__ee__ee_ee',
            'f__ee_ee__ee__ee_ee',
            '___________________',
            'f____ee__eee_______',
            '_____ee__eee_______',
            '___________________',
            'f____ee__eee_______',
            '_____ee__eee_______',
            '___________________',
            'f____ee__eee_______',
            '_____ee__eee_______',
            '___________________',
            'f____ee__eee_______',
            '_____ee__eee_______',
            '___________________',
            '_eeeee___eeee______',
            '__eeee___eeee______',
            '___________________',
            '_eeeee___eee_______',
            '__eeee___eee_______',
          ],
          seats: {
            f: {
              classes: 'first-class', //your custom CSS class
              category: '办公室'
            },
            e: {
              classes: 'economy-class', //your custom CSS class
              category: '工位'
            }

          },
          naming: {
            top: false,
            getLabel: function (character, row, column) {
              return firstSeatLabel2++;
            },
          },
          legend: {
            node: $('#legend-2'),
            items: [
              ['f', 'available', '办公室'],
              ['e', 'available', '工位'],
              ['f', 'unavailable', '已占用']
            ]
          },
          click: function () {
            var sid = $('.selected').attr('id');
            $('#selected-seats-2 li:first').remove();
            if (sid != undefined) {
              sc.get(sid).status('available');
            }
            if (this.status() == 'available') {
              $('<li>' + this.data().category + this.settings.label + '号座位 </li>')
                .attr('id', 'cart-item-' + this.settings.id)
                .data('seatId', this.settings.id)
                .appendTo($cart);
              return 'selected';
            } else if (this.status() == 'selected') {
              $('#cart-item-' + this.settings.id).remove();
              return 'available';
            } else if (this.status() == 'unavailable') {
              return 'unavailable';
            } else {
              return this.style();
            }
          }
        });
      sc.get([
        '1_1','1_4','1_7','1_8','1_11','1_12','1_15','1_16','1_18',
        '2_4','2_7','2_8','2_11','2_12','2_15','2_16','2_18','2_19',
        '3_4','3_8','3_11','3_12','3_15','3_16','3_18','3_19',
        '4_4','4_7','4_8','4_11','4_12','4_15','4_16','4_18','4_19',
        '5_1',
        '6_4','6_5','6_7','6_8','6_11','6_12','6_15','6_16','6_18','6_19',
        '7_1','7_4','7_5','7_7','7_8','7_11','7_12','7_15','7_16','7_18','7_19',
        '8_4','8_5','8_7','8_8','8_11','8_12','8_15','8_16','8_18','8_19',
        '9_1','9_4','9_5','9_7','9_8','9_11','9_12','9_15','9_16','9_18','9_19',
        '11_1','11_6','11_7','11_10','11_11','11_12',
        '12_6','12_7','12_10','12_11','12_12',
        '14_1','14_6','14_7','14_11','14_12',
        '15_6','15_7','15_10','15_11','15_12',
        '17_1','17_7','17_10','17_11','17_12',
        '18_6','18_7','18_10','18_11','18_12',
        '20_1','20_7','20_10','20_11','20_12',
        '21_6','21_7','21_10','21_11','21_12',
        '23_3','23_4','23_5','23_6','23_10','23_12','23_13',
        '24_3','24_4','24_5','24_6','24_10','24_11','24_12',
        '26_3','26_4','26_5','26_10','26_11','26_12',
        '27_3','27_4','27_5','27_6','27_10','27_11','27_12',
      ]).status('unavailable');
    });
  </script>
  <script>
    var firstSeatLabel3 = 1;
    $(document).ready(function () {
      var $cart = $('#selected-seats-3'),
        $total = $('#total-3'),
        sc = $('#seat-map-3').seatCharts({
          map: [
            'f_f__f__f__f_______',
            '_________________f_',
            '___________________',
            '____________e_ee___',
            '___________________',
            '_____________e__ee_',
            '____________ee__ee_',
            '___________________',
            '_____________ee_e_e',
            '___________________',
            '___________________',
            '___________________',
            '_ee________________',
            '____e_e_ee_________',
            '____e_e_ee_________',
            '______e____e__e____',
            '____e_e____e_______',
            '________e__e_______',
          ],
          seats: {
            f: {
              classes: 'first-class', //your custom CSS class
              category: '办公室'
            },
            e: {
              classes: 'economy-class', //your custom CSS class
              category: '工位'
            }

          },
          naming: {
            top: false,
            getLabel: function (character, row, column) {
              return firstSeatLabel3++;
            },
          },
          legend: {
            node: $('#legend-3'),
            items: [
              ['f', 'available', '办公室'],
              ['e', 'available', '工位'],
              ['f', 'unavailable', '已占用']
            ]
          },
          click: function () {
            var sid = $('.selected').attr('id');
            $('#selected-seats-3 li:first').remove();
            if (sid != undefined) {
              sc.get(sid).status('available');
            }
            if (this.status() == 'available') {
              $('<li>' + this.data().category + this.settings.label + '号座位 </li>')
                .attr('id', 'cart-item-' + this.settings.id)
                .data('seatId', this.settings.id)
                .appendTo($cart);
              return 'selected';
            } else if (this.status() == 'selected') {
              $('#cart-item-' + this.settings.id).remove();
              return 'available';
            } else if (this.status() == 'unavailable') {
              return 'unavailable';
            } else {
              return this.style();
            }
          }
        });
      sc.get([
        '1_1','1_6','1_9','1_12',
        '2_18',
        '4_13','4_15','4_16',
        '6_14','6_17','6_18',
        '7_13','7_14','7_17','7_18',
        '9_14','9_15','9_17','9_19',
        '13_3',
        '14_5','14_7','14_9','14_10',
        '15_5','15_7','15_9','15_10',
        '16_7','16_12','16_15',
        '17_5','17_7','17_12',
        '18_12',
      ]).status('unavailable');
    });
  </script>
  <script>
    var firstSeatLabel4 = 1;
    $(document).ready(function () {
      var $cart = $('#selected-seats-4'),
        $total = $('#total-4'),
        sc = $('#seat-map-4').seatCharts({
          map: [
            '____________________',
            '___eeeee_eeeee______',
            '___eeeee_eeeee______',
            '____________________',
            '____eeee_eeeee______',
            '____eeee_eeeee______',
            '____________________',
            '___eeeee_eeeee______',
            '___eeeee_eeeee______',
            '____________________',
            '__f_________________',
            '_________eeeee______',
            '_________eeeee______',
            '__f_________________',
            '_________eeeee______',
            '__f______eeeee______',
            '____________________',
          ],
          seats: {
            f: {
              classes: 'first-class', //your custom CSS class
              category: '办公室'
            },
            e: {
              classes: 'economy-class', //your custom CSS class
              category: '工位'
            }

          },
          naming: {
            top: false,
            getLabel: function (character, row, column) {
              return firstSeatLabel4++;
            },
          },
          legend: {
            node: $('#legend-4'),
            items: [
              ['f', 'available', '办公室'],
              ['e', 'available', '工位'],
              ['f', 'unavailable', '已占用']
            ]
          },
          click: function () {
            var sid = $('.selected').attr('id');
            $('#selected-seats-4 li:first').remove();
            if (sid != undefined) {
              sc.get(sid).status('available');
            }
            if (this.status() == 'available') {
              $('<li>' + this.data().category + this.settings.label + '号座位 </li>')
                .attr('id', 'cart-item-' + this.settings.id)
                .data('seatId', this.settings.id)
                .appendTo($cart);
              return 'selected';
            } else if (this.status() == 'selected') {
              $('#cart-item-' + this.settings.id).remove();
              return 'available';
            } else if (this.status() == 'unavailable') {
              return 'unavailable';
            } else {
              return this.style();
            }
          }
        });
      sc.get([
        '2_4','2_5','2_6','2_7','2_8',
        '3_4','3_5','3_6','3_7',
        '5_5','5_6','5_7','5_8',
        '6_5','6_6','6_7',
        '8_5','8_6','8_8',
        '9_4','9_5','9_6','9_7',
        '11_3',
      ]).status('unavailable');
    });
  </script>
  <script>
    var firstSeatLabel5 = 1;
    $(document).ready(function () {
      var $cart = $('#selected-seats-5'),
        $total = $('#total-5'),
        sc = $('#seat-map-5').seatCharts({
          map: [
            'f__eef______________',
            '___ee_______________',
            '___ee________e______',
            '___ee_______________',
            '___ee_______________',
            '____________________',
            '________ee__________',
            '________ee__________',
            '____________________',
            '______e_ee__________',
            '______e_ee__________',
            '______e_ee__________',
            '____________________',
            '_____ee_ee_ee_______',
            '_____ee_ee_ee_______',
            '_____ee_ee_ee_______',
            '_____ee_ee_ee_______',
            '_____ee_ee_ee__eeee_',
            '____________________',
            '_______________eeee_',
            '_____ee_ee_ee_______',
            '_____ee_ee_ee__eeee_',
            '_____ee_ee_ee_______',
            '____________________',
            'f____ee_ee_ee_ee_ee_',
            '_____ee_ee_ee_ee_ee_',
            '_____ee_ee_ee_ee_ee_',
            '_____ee_ee_ee_ee_ee_',
          ],
          seats: {
            f: {
              classes: 'first-class', //your custom CSS class
              category: '办公室'
            },
            e: {
              classes: 'economy-class', //your custom CSS class
              category: '工位'
            }

          },
          naming: {
            top: false,
            getLabel: function (character, row, column) {
              return firstSeatLabel5++;
            },
          },
          legend: {
            node: $('#legend-5'),
            items: [
              ['f', 'available', '办公室'],
              ['e', 'available', '工位'],
              ['f', 'unavailable', '已占用']
            ]
          },
          click: function () {
            var sid = $('.selected').attr('id');
            $('#selected-seats-5 li:first').remove();
            if (sid != undefined) {
              sc.get(sid).status('available');
            }
            if (this.status() == 'available') {
              $('<li>' + this.data().category + this.settings.label + '号座位 </li>')
                .attr('id', 'cart-item-' + this.settings.id)
                .data('seatId', this.settings.id)
                .appendTo($cart);
              return 'selected';
            } else if (this.status() == 'selected') {
              $('#cart-item-' + this.settings.id).remove();
              return 'available';
            } else if (this.status() == 'unavailable') {
              return 'unavailable';
            } else {
              return this.style();
            }
          }
        });
      sc.get([
        '1_4','1_5','1_6',
        '2_4','2_5',
        '3_4','3_5','3_14',
        '4_4',
        '5_5',
        '7_9','7_10',
        '8_10',
        '10_9','10_10',
        '11_9','11_10',
        '12_7','12_9','12_10',
        '14_6','14_7','14_9','14_10','14_12','14_13',
        '15_6','15_7','15_9','15_10','15_12',
        '16_6','16_7','16_9','16_10','16_12',
        '17_6','17_7','17_9','17_10','17_12','17_13',
        '18_6','18_7','18_9','18_10','18_13','18_16','18_17','18_18',
        '20_16','20_17','20_18',
        '21_6','21_7','21_9','21_10','21_12','21_13',
        '22_6','22_7','22_9','22_10','22_12','22_13','22_16','22_17','22_18','22_19',
        '23_7','23_9','23_10','23_13',
        '25_1','25_6','25_7','25_10','25_12','25_13','25_15','25_16','25_18','25_19',
        '26_6','26_7','26_9','26_10','26_13','26_15','26_16','26_18','26_19',
        '27_6','27_7','27_9','27_10','27_12','27_13','27_15','27_16','27_18','27_19',
        '28_7','28_9','28_12','28_13','28_15','28_16','28_18','28_19',
      ]).status('unavailable');
    });
  </script>
  <!-- 水印 -->
  <script src="../../assets/water/mark.js"></script>
  <script>
    watermark({watermark_txt0:'赛特斯信息科技股份有限公司',watermark_txt1:'',watermark_txt2:''});
  </script>
</body>

</html>